<!DOCTYPE html>
<!--[if lt IE 7]>
<html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>
<html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>
<html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html> <!--<![endif]-->

<!-- head -->
<#include "../common/assignparam.ftl"  />
<@header deep="2"/>
<link rel="stylesheet" type="text/css" href="${contextPath}/skin/klxlearning/main.css"/>
<body class="body">

<!-- 头部 -->
<#assign currentChannel="course"/>
<#include "../common/header.ftl"  />  
<div>
  <section class="course-detail-header before container">
            <ol class="breadcrumb breadcrumb-o">
              <!-- 此处是面包屑导航模板 -->              
           </ol>
            <div class="es-section clearfix row" id="course">
                  <div class="course-sive">
                      <img class="img-responsive" src="">
                  </div>
                  <div class="course-info">
                    <h2 class="title"></h2>
                    <p class="overflowOmit"></p>
                    <div class="subtitle"></div>
                    <div class="metas">
                      <!-- 此处插入星星模板模板 -->
                    </div>
                    <!--<div class="syll-price">
                        <p class="discount-price">
                            <span>价格</span>
                            <span class="price">0.01元 </span>      
                        </p>
                    </div>-->
                </div>
          <div class="course-operation clearfix">
                      <!--<div class="student-num hidden-xs">
                          <i class="es-icon es-icon-people"></i><span class="peopleCount"></span>人
                      </div>-->
                       <span class="es-share top">
                              <!-- JiaThis Button BEGIN -->
                
        
                
                <!-- JiaThis Button END -->
                  
                    </span>
                     <ul class="course-data clearfix active">
                          <li class="font-21">
                            <i class="es-icon es-icon-people"></i><span class="peopleCount"></span>人
                          </li>
                          <!-- <li class="shareCourse">
                            此处插入分享按钮模板 
                   
                    </li> -->
                      </ul>
                      
                      <div class="buy">
                          <a class="btn btn-primary btn-lg" address = "${contextPath}/user/courselearninig/learning" >加入学习</a>
                        </div>
                 </div>
            </div>

    </section>
    
        <div id="content-container" class="container">
            <div class="course-detail row">
                <div class="hackSuccess"><i class="glyphicon glyphicon-ok"><span>评价成功</span></i></div>
                <div class="col-md-8  course-detail-main">
                    <section class="es-section">
                       
                       <div class="section-comment" id="active">
                       <!-- 此处发布评论模板 -->
                      </div>
                       
                        <div class="nav-btn-tab">
                            <ul class="nav nav-tabs" role="tablist">
                                <li role="presentation" class="active"><a >课程概览</a></li>
                                <li role="presentation" class="timeProgress"><a>课时列表</a></li>
                                <li role="presentation" class="evaluateList"><a>评价<span id="evaluateNum" class="text-muted "></span></a></li>
                                <li role="presentation" class="notesList"><a> 笔记<span class="text-muted " id="notesNum"></span></a></li>
                            </ul>
                        </div>
                        <div class="course-detail-content contentShow">
                        </div>
                        <div class="course-detail-content">
                         <!-- 课时列表插入 -->
                          <div id="courseProgressList"></div>
                        </div>
                        <!-- 评价模板插入 -->
                        <div class="evaluate">
                        <div class="course-detail-content" id="course-evaluate-list">
                        
                        </div>
   
                        </div>
                        <div class="course-detail-content">
                          <div class="note-filter nav-filter clearfix">
                            
                                <ul class="nav nav-pills nav-pills-sm">
                                 <li class="dropdown hidden-xs">
                                      <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                        <span>排序：</span>
                                          最新笔记
                                      </a>
                                      <ul class="dropdown-menu hidden-xs">
                                          <li class="active newNotes" id="newNotes"><a>最新笔记</a></li>
                                          <li class="mostNotes" id="mostNotes"><a>点赞最多</a></li>
                                      </ul>
                                   </li>
                               </ul>
                          </div>
                          <div class="note-list" id="note-list">
                        <!-- 此处是笔记模板 -->
                          </div>
                        </div>
                        <div class="paging hide"></div>
                    </section>
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title"><i class="es-icon es-icon-explore"></i>相关课程</h3>
                        </div>
                        <div class="panel-body">
                            <div class="course-list no-shadow no-margin">
                                <div class="row">
                                  <!-- 此处插入相关课程模板 -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-4  course-sidebar">
                    <!--<div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title"><i class="es-icon es-icon-assignmentind"></i>授课教师</h3>
                        </div>
                        <div class="panel-body">
                            <div class="media media-default">
                                <div class="media-left">
                                    <a class=" js-user-card" href="" ><img class="avatar-md" src="${contextPath}/images/klxlearning/2.jpg" ></a>
                                </div>
                                <div class="media-body">
                                    <div class="title">
                                        <a class="link-dark link-light" href="">格洛咪</a>
                                    </div>
                                    <div class="content">klx官方运营</div>
                                </div>
                            </div>
                            <div class="media media-default">
                                <div class="media-left">
                                    <a class=" js-user-card" href="">
                                        <img class="avatar-md" src="${contextPath}/images/klxlearning/5.jpg">
                                    </a>
                                </div>
                                <div class="media-body">
                                    <div class="title">
                                        <a class="link-dark link-light" href="">linjay</a>
                                    </div>
                                    <div class="content">初级教师</div>
                                </div>
                            </div>
                        </div>
                    </div>-->
                  <!-- 此处是插入侧边栏模板 -->
                </div>
            </div>
        </div>
    </div>
<!-- 评论星星数 -->
<script type="text/template" id="courseScore">
    <div class="score">
        <%_.each(evaluateConfig,function(i){%>
        <%for(var k = 0 ; k < i.evaluateTotalScore; k++){%>
        <i class="es-icon es-icon-star <%if(k < i.avgEvaluateScore){%>color-warning<%}%>"></i>
        <% } %>
        <span><%=i.countEvaluateNum%>人</span>
         <%})%>
    </div>
</script>
<!-- 发布评论 -->
<script type="text/template" id="commentScore">

 <%_.each(evaluateConfig,function(i){%>
    <ul>
        <span>请打分：</span>
       <%for(var k = 0 ; k < i.evaluateTotalScore; k++){%>
        <li class="color-warning"></li>
     <%}%>
    </ul>
    <span><textarea  placeholder="请输入评价内容" id="tare" cols="20" class="enter"></textarea></span>
    <span><button typeComment="<%=i.evaluateConfigId%>" type="button" class="btn btn-cloth">发 布</button></span>
 <%})%>

</script>
<!-- 侧边栏模板 -->
<script type="text/template" id="studentDynamics">
 <div class="panel panel-default student-dynamic">
                        <div class="panel-heading">
                            <h3 class="panel-title"><i class="es-icon es-icon-recentactors"></i>学员动态</h3>
                        </div>
                        <div class="panel-body">
<% _.each(listCourse,function(i){%>  
  <div class="media media-dynamic">
      <div class="media-left">
          <span class=" js-user-card"></span>
      </div>
      <div class="media-body">
        <div class="title">
          <span class=""><%= i.userBean.userName %></span>
        </div>
        <div class="content">
            开始学习课时 <a class="link-" href="${contextPath}/portal/courselibrary/toDetail#<%= i.courseId%>" title=""><%= i.course.courseName%></a>
        </div>
        <span class="date"><%=i.lastLearnDate%></span>
      </div>
    </div>
<% })%> 
 </div>
</div>   
</script>
<!-- 相关课程模板 -->
<script type="text/template" id="correlated">
<%_.each(courseList,function(i){%>
  <div class="col-lg-4 col-md-6 col-xs-6 ">
    <div class="cc-l-wrap">
        <section class="course-img">
<img src="${contextPath}/components/gtattachment/open/downloadAttachment.json?attachmentId=<%=i.defaultImageId%>" width="100%" class="img-responsive" >
                <div class="cc-mask">
                <a href="${contextPath}/portal/courselibrary/toDetail#<%=i.courseId%>"  class="comm-btn c-btn-1">开始学习</a>
            </div>
        </section>
        <h3 class="hLh30 txtOf mt10">
            <a href="${contextPath}/portal/courselibrary/toDetail#<%=i.courseId%>" class="course-title fsize18 c-333 omit"><%=i.courseName%></a>
        </h3>
        <section class="mt10 hLh20 of">
            <span class="fr jgTag bg-orange"><tt class="c-fff fsize14 f-fG">作者：<%=i.author%></tt></span>
            <span class="fl jgAttr c-ccc f-fA"><tt class="c-999 f-fA"><%=i.lastLearnDate%></tt></span>
        </section>
      </div> 
</div>
<% }) %>
</script>

<!-- 分享功能的模板 -->
<script type="text/template" id="shareBtn">
    <span class="es-share top">
                <div class="jiathis_style">
                <a href="http://www.jiathis.com/share" class="jiathis" target="_blank" onmouseover="setShare('<%=courseSolution.courseName%>','${contextPath}/portal/frontend/dgo?ftlpath=course/syllabus-particulars.ftl#<%=courseSolution.courseId%>','分享的文本摘要')"  ><span><span class="es-icon es-icon-share  font-21"></span></span></a>
                <span class="font-21" id="fenx">分享</span>
                </div>                              
       </span>
</script>
<!-- 面包屑导航模板 -->
<script type="text/template" id="crumbsNav">
     <li><a href="${contextPath}/portal/courselibrary/toCourseLibrary.do">全部课程</a></li>
     <%_.each(courseClassify,function(item,i){%>
      <li><%if(i < (courseClassify.length-1)){%><a href="${contextPath}/portal/courselibrary/toCourseLibrary.do?queryClassifyId=<%=item.classifyId%>"><%=item.classifyName%></a><%}else{%><%=item.classifyName%> <%}%></li>
    <% }) %>    
</script>
<!-- 笔记模板 -->
    <script type="text/template" id="note">
      <% _.each(noteList, function (note) { %>
        <div class="media note-item">
                    <div class="media-left">
                        <a class=" js-user-card">
                         <% if(note.accountBean.headPhoto){%>
      <img class="avatar-sm" src="../../components/gtattachment/open/downloadAttachment.json?attachmentId=<%=note.accountBean.headPhoto%>">
            <% } else{%>
             <img class="avatar-sm" src="${contextPath}/images/klxlearning/man.png">
             <%}%>
                                        
                </a>
            </div>
            <div class="media-body">
                <div class="content">
                    <p><%= note.noteContent %></p>
                </div>
                <a class="more more-show">[展开全文]</a>
                <div class="metas clearfix">
                    <a class="link-dark name" ><%= note.accountBean.userName %></a>
                    <span><%=note.editTime%></span>
                    <a href="" class="period" target="_blank"></a>
              <span class="metas-sns" typeId="<%=note.noteId%>">
              <span class="icon-favour">
               <a class="js-like" ><i class="es-icon es-icon-thumbup"></i><span class="js-like-num"><%= note.likeCount %></span></a>
            </span>
             </span>
                </div>
            </div>
       </div>
  <% }) %>
</script>

<!-- 评价模板 -->
  <script type="text/template" id="evaluateList">
        <% _.each(evaluateBeanList, function (item) { %>
         <div class="js-reviews">
            <div class="media media-evaluate">
                <div class="media-left">
                <% if(item.accountBean.headPhoto){%>
                <img class="avatar-sm" src="../../components/gtattachment/open/downloadAttachment.json?attachmentId=<%=item.accountBean.headPhoto%>">
                <% } else{%>
                 <img class="avatar-sm" src="${contextPath}/images/klxlearning/man.png">
                 <%}%>

                </div>
                <div class="media-body">
          <div class="title"><a class="link-dark "><%=item.accountBean.userName%></a>
                        <%= item.editTime%>
                    </div>
                   <div class="score">
               <% for(var i = 0; i < item.evaluateConfig.evaluateTotalScore; i++){%>
     <i class="es-icon es-icon-star <%if(i < item.evaluateScore){%>color-warning<%}%>"></i>
        <%}%> 
                                         
                    </div>
                    <div class="content">
                        <div class="short-content"><%= item.evaluateContent %></div>
                        <div class="full-content" style="display:none;"><%= item.evaluateContent %></div>
                    </div> 
                </div>
            </div>
        </div>
        <% }) %>
    </script>
<!-- 学时进度模板 -->
<script type="text/template" id="studyCenterList">
           <div class="toolbar-pane-container">
                    <div class="lesson-pane courseDetail">
                        <div class="course-item-list-in-toolbar-pane ps-container" id="firstpane" >
                         <% var index = 0%>
                         <% var idx = 0%>
                         <% var id = 0%>
                         <% var oneLevel = 0%>
                         <% var node=0%>
                         <% var mynode = 0%>
                        <ul class="period-list" id="course-item-list">
                        <%if(unitList){%>
                          <% _.each(unitList,function(item){%>
                            <%if((item.level ==1) && (item.unitType == 1)){%>
                                <% idx = 0%>
                                <% ++id%>

                                <li class="chapter clearfix chapter-clear">
                                    <i class="es-icon es-icon-toc"></i>
                                    <span class="title">
                                         第 <%=++index%> 章：
                                                <%=item.title%>
                                    </span>
                                    <span class="period-show"><i children="child<%=id%>"  class="video-chapter up es-icon es-icon-remove"></i></span>
                                </li>
                                <%} else if((item.level ==1) && (item.unitType != 1)){%>
                                   <li unitId="<%=item.unitId%>" resourceType="<%=item.entityId%>"  class="one-level period lesson-item lesson-item-23 <%if(item.current){%>item-active<%}%>" data-id="23" data-num="3">
                                        <a  title="<%=item.title%>">
                                            <%if(!item.unitLearnStatus || item.unitLearnStatus == 2){%>
                                                <i class="es-icon es-icon-undone color-primary status-icon"></i>
                                            <%} else if(item.unitLearnStatus == 1){%>
                                                <i class="es-icon es-icon-done1 color-primary status-icon"></i>
                                            
                                            <%}else{%>  
                                                <i class="es-icon es-icon-doing color-primary status-icon"></i>
                                            <%}%>   
                                            <span class="title"> 课时 <%=++oneLevel%>：<%=item.title%></span>
                                          
                                                <span class="course-type">
                                                  <i class="es-icon es-icon-videoclass" data-toggle="tooltip" data-placement="top" title=""
                                                     data-original-title="视频课程"></i>
                                            </span>
                                  </a>
                            </li>
                                <%}%>
                               <%if((item.level ==3) && (item.unitType != 1)){%>
                               <ul class="none-list child child<%=id%> child<%=id%>3 child-level3" style="display:block;">
                               <%} else {%>
                                <ul class="none-list child child<%=id%>" style="display:block;">
                               <%}%>
                                <%if((item.level ==2) && (item.unitType == 1)){%>
                                   
                                    <li class="child-level2 section firstChild" style="line-height: 36px; margin-bottom: 10px; padding-left:17px"><span class="title"><%=item.title%> <span class="period-show"><i children="child<%=++mynode%>3"  class="child up es-icon es-icon-remove "></i></span></span></li>
                                  <%}%>
                                   <%if((item.level ==2) && (item.unitType != 1)){%>
                                   <%++node%>
                                    <li unitId="<%=item.unitId%>" resourceType="<%=item.entityId%>"  class="child<%=++mynode%>3 period lesson-item lesson-item-23 child-level2 <%if(item.current){%>item-active<%}%>" data-id="23" data-num="3">

                                        <a  title="<%=item.title%>">
                                            <%if(!item.unitLearnStatus || item.unitLearnStatus == 2){%>
                                                <i class="es-icon es-icon-undone color-primary status-icon"></i>
                                            <%} else if(item.unitLearnStatus == 1){%>
                                                <i class="es-icon es-icon-done1 color-primary status-icon"></i>
                                            
                                            <%}else{%>  
                                                <i class="es-icon es-icon-doing color-primary status-icon"></i>
                                            <%}%>
                                            <span class="title"> 课时<%=++oneLevel%>：<%=item.title%></span>
                                          
                                                <span class="course-type">
                                                  <i class="es-icon es-icon-videoclass" data-toggle="tooltip" data-placement="top" title=""
                                                     data-original-title="视频课程"></i>
                                            </span>
                                  </a>
                            </li>
                        <%}%>
                          <%if((item.level ==3) && (item.unitType != 1)){%>
                                    <li unitId="<%=item.unitId%>"  resourceType="<%=item.entityId%>"  class="period lesson-item lesson-item-23 <%if(item.current){%>item-active<%}%>" data-id="23" data-num="3">

                                        <a  title="<%=item.title%>">
                                            <%if(!item.unitLearnStatus || item.unitLearnStatus == 2){%>
                                                <i class="es-icon es-icon-undone color-primary status-icon"></i>
                                            <%} else if(item.unitLearnStatus == 1){%>
                                                <i class="es-icon es-icon-done1 color-primary status-icon"></i>
                                            
                                            <%}else{%>  
                                                <i class="es-icon es-icon-doing color-primary status-icon"></i>
                                            <%}%>
                                            <span class="title"> 课时<%=++oneLevel%>：<%=item.title%></span>
                                          
                                                <span class="course-type">
                                                  <i class="es-icon es-icon-videoclass" data-toggle="tooltip" data-placement="top" title=""
                                                     data-original-title="视频课程"></i>
                                            </span>
                                  </a>
                            </li>
                        <%}%>
                    </ul>
              <%})%>
              <%}%>
            </ul>
              
            </div>
            </div>
            </div>

</script>
<!--底部-->
<@portalFooter deep="2"/>
<!-- 侧边栏快捷操作 -->
<#include "../common/learningCenterSlider.ftl"  /> 
<div id="login-modal" class="modal" data-url="/login/ajax"></div>
<div id="modal" class="modal"></div>
<script type="text/javascript">
    function setShare(title, url, summary) { 
        jiathis_config.title = title;  
        jiathis_config.url = url;
        jiathis_config.summary = summary;   
        jiathis_config.shortUrl = true;
        jiathis_config.hideMore = true;      
    }  
  var jiathis_config = {
       boldNum:0,
      siteNum:4,
      sm:"weixin,tsina,cqq,qzone"
  };
</script>
<script type="text/javascript" src="${contextPath}/common/klxlearning/underscore-1.8.3-min.js"></script>
<script type="text/javascript" src="${contextPath}/common/klxlearning/myJs/syllabus-particulars-01.js"></script>
<script type="text/javascript" src="http://v3.jiathis.com/code/jia.js" charset="utf-8"></script>

</body>
</html>